@import "reset.css";
* {
  margin: 0;
  padding: 0;
}

body {
  width: 100%;
  height: 100%;
  background-image: linear-gradient(45deg,#323233,#353537);
}

.index {
  display: flex;
  height: 100%;
  width: 100%;
  .index-left {
    width: 400px;
    margin: 0 calc((100% - 400px * 3) / 3 / 2);
    .index-left-one {
      box-sizing: border-box;
      padding: 20px;
    }
    .index-left-two {
      padding: 20px;
      box-sizing: border-box;
    }
  }
  .index-center {
    width: 400px;
    margin: 0 calc((100% - 400px * 3) / 3 / 2);
    h4 {
      text-align: center;
      font-size: 100px;
      font-weight: 800;
      margin: 40px 20px 20px 0px;
      color: aliceblue;
    }
  }

  .index-right {
    width: 400px;
    margin: 0 calc((100% - 400px * 3) / 3 / 2);
    .index-right-one {
      box-sizing: border-box;
      padding: 30px;
    }
    .index-right-two {
      padding: 20px;
      box-sizing: border-box;
    }
  }
}

.bottom {
  display: flex;
  justify-content: space-between;
  .index-left-three {
    margin: 20px;
    box-sizing: border-box;
  }
  .index-right-three {
    margin: 20px;
    box-sizing: border-box;
  }
}
